<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" style="height: 100%;">
<head>
    <title>众志成城，抗击疫情</title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../static/register.css" th:href="@{/css/register.css}">
    <script src="../static/js/jQuery-3.5.1.min.js" th:src="@{/js/jQuery-3.5.1.min.js}"></script>
    <script src="../static/js/register.js" th:src="@{/js/register.js}"></script>

</head>
<body style="height: 100%;">
<div class="background"></div>
<div class="loginBox">
    <ul>
        <li class="title">注册账号</li>
        <li><span>账号：</span>
            <input type="text" placeholder="请输入用户账号" id="username" ><i>*</i></li>
        <li><span>名称：</span>
            <input type="text" placeholder="请输入用户名" id="nickname" ><i>*</i></li>
        <li><span>电话：</span>
            <input type="text" placeholder="请输入手机号码" id="phone" ><i>*</i></li>
        <li><span>密码：</span>
            <input type="password" placeholder="请输入密码" id="password"><i>*</i></li>
        <li><span>确认密码：</span>
            <input type="password" placeholder="请重新输入密码" id="password2"><i>*</i></li>
        <li><span>性别：</span>
        <li id="gender">
            <input type="radio" id="male" name="gender"><label for="male">男</label>
            <input type="radio" id="female" name="gender"><label for="female">女</label>
        </li>
        </li>
        <li><span>邮箱：</span>
            <input type="text" placeholder="请输入邮箱" id="mail" ></li>
        <span class="loginLink"><a href="login">已有账号，去登陆</a></span>
        <div class="registerBtn"><a onclick="registerCheck()">注册</a></div>
    </ul>
</div>
<script>
    var password1=document.querySelector('#password');
    var password2=document.querySelector('#password2');
    var registerBtn=document.querySelector(".registerBtn");
    registerBtn.addEventListener('click',function(){
        if(password1.value!==password2.value){
            alert("两次输入密码不一致");
        }
    })
    var gender=document.querySelector("#gender");
    var male=document.querySelector("#male");
    var female=document.querySelector("#female");
    male.addEventListener("click",function(){
        if(male.checked===true){
            gender.value=1;  //男
        }
    })
    female.addEventListener("click",function(){
        if(female.checked===true){
            gender.value=2;  //女
        }
    })
</script>
</body>
</html>